<template>
  <div class="app-container">
    <el-row>
      <el-input
        placeholder="分组编码、模板主诊断"
        v-model="query.s"
        clearable
        style="width: 250px"
        @keyup.enter.native="search"
      >
      </el-input>

      <el-button type="primary" round style="margin-left: 5px" @click="search"
        >查询</el-button
      >
      <!-- <el-radio-group
        style="margin-left:40px"
        v-model="query.filterType"
        @change="chagneRadioType"
      >
        <el-radio :label="0">全部</el-radio>
        <el-radio :label="1">仅显示本院标杆差异较大模板</el-radio>
        <el-radio :label="2">仅显示模板标杆差异较大模板</el-radio>
      </el-radio-group> -->
    </el-row>

    <el-row>
      <el-table
        :data="ls"
        @cell-click="cellClick"
        :row-style="roleStyle"
        border
        style="width: 100%"
        :span-method="objectSpanMethod"
      >
        <el-table-column
          prop="路径名称"
          label="模板主诊断"
          width="180"
        ></el-table-column>
        <el-table-column prop="分组编码" label="DRG" width="80">
          <template slot-scope="scope">
            <el-dropdown>
              <span class="el-dropdown-link">
                {{ scope.row.分组编码
                }}<i class="el-icon-arrow-down el-icon--right"></i>
              </span>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item
                  v-if="!scope.row.审核"
                  @click.native.prevent="handleCommand(scope.row)"
                  >审核</el-dropdown-item
                >
                <el-dropdown-item
                  v-if="scope.row.审核"
                  @click.native.prevent="handleCommand2(scope.row)"
                  >取消审核</el-dropdown-item
                >
              </el-dropdown-menu>
            </el-dropdown>
          </template>
        </el-table-column>
        <el-table-column prop="标杆类型" label="标杆类型" width="100">
        </el-table-column>
        <el-table-column prop="标准总费用" label="总费用" width="140">
          <template slot-scope="scope">
            <span v-if="scope.row.标杆类型 != '模板标杆' || scope.row.审核">{{
              scope.row.标准总费用
            }}</span>
            <input v-else v-model="scope.row.标准总费用" />
          </template>
        </el-table-column>
        <el-table-column prop="标准床日" label="床日">
          <template slot-scope="scope">
            <span v-if="scope.row.标杆类型 != '模板标杆' || scope.row.审核">{{
              scope.row.标准床日
            }}</span>
            <input v-else v-model="scope.row.标准床日" />
          </template>
        </el-table-column>
        <el-table-column
          prop="标准药品费"
          :label="是否中医院性质 ? '西药（成药）费' : '药品费'"
        >
          <template slot-scope="scope">
            <span v-if="scope.row.标杆类型 != '模板标杆' || scope.row.审核">{{
              scope.row.标准药品费
            }}</span>
            <input
              @change="changePrice(scope.$index)"
              v-else
              v-model="scope.row.标准药品费"
            />
          </template>
        </el-table-column>
        <el-table-column prop="标准检验费" label="检验费">
          <template slot-scope="scope">
            <span v-if="scope.row.标杆类型 != '模板标杆' || scope.row.审核">{{
              scope.row.标准检验费
            }}</span>
            <input
              @change="changePrice(scope.$index)"
              v-else
              v-model="scope.row.标准检验费"
            />
          </template>
        </el-table-column>
        <el-table-column prop="标准检查费" label="检查费">
          <template slot-scope="scope">
            <span v-if="scope.row.标杆类型 != '模板标杆' || scope.row.审核">{{
              scope.row.标准检查费
            }}</span>
            <input
              @change="changePrice(scope.$index)"
              v-else
              v-model="scope.row.标准检查费"
            />
          </template>
        </el-table-column>
        <el-table-column prop="标准治疗费" label="治疗费">
          <template slot-scope="scope">
            <span v-if="scope.row.标杆类型 != '模板标杆' || scope.row.审核">{{
              scope.row.标准治疗费
            }}</span>
            <input
              @change="changePrice(scope.$index)"
              v-else
              v-model="scope.row.标准治疗费"
            />
          </template>
        </el-table-column>
        <el-table-column prop="标准手术费" label="手术费">
          <template slot-scope="scope">
            <span v-if="scope.row.标杆类型 != '模板标杆' || scope.row.审核">{{
              scope.row.标准手术费
            }}</span>
            <input
              @change="changePrice(scope.$index)"
              v-else
              v-model="scope.row.标准手术费"
            />
          </template>
        </el-table-column>
        <el-table-column prop="标准耗材费" label="耗材费">
          <template slot-scope="scope">
            <span v-if="scope.row.标杆类型 != '模板标杆' || scope.row.审核">{{
              scope.row.标准耗材费
            }}</span>
            <input
              @change="changePrice(scope.$index)"
              v-else
              v-model="scope.row.标准耗材费"
            />
          </template>
        </el-table-column>

        <el-table-column v-if="是否中医院性质" prop="标准草药费" label="草药费">
          <template slot-scope="scope">
            <span v-if="scope.row.标杆类型 != '模板标杆' || scope.row.审核">{{
              scope.row.标准草药费
            }}</span>
            <input
              @change="changePrice(scope.$index)"
              v-else
              v-model="scope.row.标准草药费"
            />
          </template>
        </el-table-column>

        <el-table-column prop="标准其他费" label="其他费">
          <template slot-scope="scope">
            <span v-if="scope.row.标杆类型 != '模板标杆' || scope.row.审核">{{
              scope.row.标准其他费
            }}</span>
            <input
              @change="changePrice(scope.$index)"
              v-else
              v-model="scope.row.标准其他费"
            />
          </template>
        </el-table-column>

        <el-table-column prop="选择" label="标杆选择">
          <template slot-scope="scope">{{
            scope.row.选择 ? "✔" : ""
          }}</template>
        </el-table-column>
        <el-table-column prop="审核人" label="审核人"> </el-table-column>
        <el-table-column
          prop="审核时间"
          :formatter="审核时间fmt"
          label="审核时间"
        >
        </el-table-column>
      </el-table>
    </el-row>

    <el-row>
      <div class="block">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="query.page"
          :page-sizes="[6, 9, 12, 50, 100, 200, 300, 400]"
          :page-size="query.size"
          layout="total, sizes, prev, pager, next, jumper"
          :total="query.total"
        >
        </el-pagination>
      </div>
    </el-row>
  </div>
</template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import { Format } from "@/utils/Utils";
import { drgWeightLs } from "@/api/pathway";
import index from "@/components/Breadcrumb/index.vue";
import { saveTplDrg, cnHops } from "@/api/PathTemplate";
import { UserModule } from "@/store/modules/user";
import { setTimeout } from "timers";
@Component({
  components: { index },
  name: "drgweighted",
})
export default class extends Vue {
  private query: any = {
    s: "",
    page: 1,
    size: 12,
    total: 0,
    // filterType: 0
  };

  private handleCommand2(row: any) {
    let ts = this.ls.filter(
      (it) => it.分组编码 == row.分组编码 && it.路径id == row.路径id
    );
    ts.forEach((it: any) => {
      it.审核 = false;
    });
  }
  private 审核时间fmt(row: any) {
    let sh = row.审核时间;
    if (!sh) return "";
    return sh.split(" ")[0];
  }
  private async handleCommand(row: any) {
    let loading = this.$loading({ text: "正在提交...." });
    let ts = this.ls.filter(
      (it) => it.分组编码 == row.分组编码 && it.路径id == row.路径id
    );
    ts.forEach((it: any) => {
      if (!it.选择) {
        it.审核人 = "";
        it.审核时间 = "";
      } else {
        it.审核人 = UserModule.name;
        it.审核时间 = Format("yyyy-MM-dd", new Date());
      }
      it.审核 = true;
      it.默认 = it.选择;
    });
    for (let o of ts) {
      await saveTplDrg(o);
    }
    loading.close();
  }
  objectSpanMethod(p: any) {
    let columnIndex = p.columnIndex;
    let rowIndex = p.rowIndex;

    if (columnIndex === 0 || columnIndex === 1) {
      if (rowIndex % 3 === 0) {
        return {
          rowspan: 3,
          colspan: 1,
        };
      } else {
        return {
          rowspan: 0,
          colspan: 0,
        };
      }
    }
  }

  private roleStyle(p: any) {
    let row = p.row;
    if (row.来自模板) {
      return { color: "blue" };
    }
    return {};
  }
  private chagneRadioType() {
    this.loadDrgWeightLs();
  }
  private changePrice(index) {
    console.log(index);
    const item = this.ls[index];
    console.log(this.ls[index]);
    const {
      标准药品费,
      标准检验费,
      标准检查费,
      标准治疗费,
      标准手术费,
      标准耗材费,
      标准草药费,
      标准其他费,
    } = this.ls[index];
    item.标准总费用 = (
      (Number(标准药品费) || 0) +
      (Number(标准检验费) || 0) +
      (Number(标准检查费) || 0) +
      (Number(标准治疗费) || 0) +
      (Number(标准手术费) || 0) +
      (Number(标准耗材费) || 0) +
      (Number(标准草药费) || 0) +
      (Number(标准其他费) || 0)
    ).toFixed(2);
    this.$set(this.ls, index, item);
  }
  private cellClick(row: any, column: any) {
    let property = column.property;

    if (row.审核) return;

    if (property == "选择") {
      this.ls
        .filter(
          (it: any) =>
            it != row && it.分组编码 == row.分组编码 && it.路径id == row.路径id
        )
        .forEach((it: any) => {
          it.选择 = false;
        });
      if (!row.选择) row.选择 = !row.选择;
    }
    //console.log("....", row, property);
  }

  private search() {
    this.query.page = 1;
    this.loadDrgWeightLs();
  }

  private colMap: any = {
    CHSDRG: "市级标杆",
    HIS: "我院标杆",
    // 模板标杆: "模板标杆",
    市级标杆: 1,
    本院标杆: 2,
    模板标杆: 3,
  };
  // private 版本fmt(row: any, column: any, cellValue: any) {
  //   let p = column.property;
  //   return this.colMap[cellValue];
  // }
  private handleSizeChange(val: number) {
    this.query.size = val;
    this.loadDrgWeightLs();
  }
  private handleCurrentChange(val: number) {
    this.query.page = val;
    this.loadDrgWeightLs();
  }

  private 是否中医院性质: boolean = false;

  private async created() {
    this.loadDrgWeightLs();
    const { data } = await cnHops({});
    this.是否中医院性质 = data;
  }
  private ls: Array<any> = [];

  private async loadDrgWeightLs() {
    let d: any = await drgWeightLs(this.query);
    d = d.data || {};

    // let ts: Array<any> = [];
    // let scopes: Array<any> = ["CHSDRG", "HIS", "模板标杆"];
    // let codes = Array.from(
    //   new Set((d.records || []).map((it: any) => it.分组编码))
    // );
    // let records = d.records || [];
    // for (let c of codes) {
    //   for (let s of scopes) {
    //     let ones = records.filter(
    //       (it: any) => it.分组编码 == c && it.版本 == s
    //     );

    //     let o: any = {};
    //     if (ones.length > 0) {
    //       o = ones[0];
    //     } else {
    //       let f = records.filter((it: any) => it.分组编码 == c);

    //       o = {
    //         分组编码: c,
    //         版本: s,
    //         选择: false,
    //         mdc专业: f[0].mdc专业,
    //         mdc专业名称: f[0].mdc中文名称,
    //         分组名称: f[0].分组名称,
    //       };
    //     }
    //     let cols = [
    //       "标准费用",
    //       "标准床日",
    //       "标准药品费",
    //       "标准检验费",
    //       "标准检查费",
    //       "标准治疗费",
    //       "标准手术费",
    //       "标准耗材费",
    //     ];
    //     cols.forEach((k: string) => {
    //       if (!o[k]) {
    //         o[k] = "";
    //       }
    //     });
    //     ts.push(o);
    //   }
    //   let ts2 = ts.filter((it: any) => it.分组编码 == c);
    //   let ts3 = ts2.filter((it: any) => it.选择);
    //   if (ts3.length == 0) {
    //     ts2[0].选择 = true;
    //   }
    // }
    this.ls = d.records;
    this.query.total = d.total;
  }
}
</script>
<style lang="scss" scoped>
.el-table .el-table__cell {
  padding: 5 !important;
}

td input {
  border: 0 !important;
  height: 100%;
  width: 100%;
}
</style>
